<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
    <link href="/assets/home/css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="/assets/home/css/animate.min.css" />
    <link rel="stylesheet" href="/assets/home/css/reset.css">
    <link rel="stylesheet" href="/assets/home/css/comment.css">
    <script src="/assets/home/js/jquery-1.9.1.min.js"></script>
    <script src="/assets/home/js/mui.min.js"></script>
    <script src="/assets/home/js/wow.min.js"></script>
    <title>购买完成</title>
    <link rel="stylesheet" href="/assets/home/plugin/raty/raty.css" />
    <script src="/assets/home/plugin/raty/raty.min.js"></script>
</head>

<body>
    <img src="{$order.subject.thumbs_text}" style="width:100%;" class="wow">
    <div class="weui-cells__title wow" style="font-size:16px;" data-wow-delay="100ms">{$order.subject.title}</div>
    <form method="post">
        <div class="weui-cells weui-cells_form wow" data-wow-delay="200ms">
            <div class="weui-cell">
                <div class="weui-cell__bd">
                    <textarea class="weui-textarea" placeholder="请输入内容" name="content" rows="3" {$order.iscomment?'readonly':''}>{$comment.content}</textarea>
                </div>
            </div>
        </div>
        <div class="weui-cells weui-cells_form wow" data-wow-delay="300ms">
            <div class="weui-cell">
                <div class="weui-cell__bd">
                    <div id="raty" data-raty></div>
                    <input type="hidden" name="rate" value="" />
                </div>
            </div>
        </div>
        <div class="action wow" data-wow-delay="300ms">
            {$order.iscomment?'':'<button type="button" class="mui-btn mui-btn-primary">立即提交</button>'}
        </div>
    </form>
</body>

</html>
<script>
    var rate = 0,id = {$order.id}

    var raty = new Raty(document.getElementById('raty'), {
        score:'{$comment.rate}',
        starOn:"/assets/home/plugin/raty/images/star-on.png",
        starOff:"/assets/home/plugin/raty/images/star-off.png",
        starHalf:"/assets/home/plugin/raty/images/star-half.png",
        readOnly:Boolean({$order.iscomment?1:0}),
        halfShow:true,
        size:10,
        click: function(score, element, evt) 
        {
            // console.log(score)
            $("input[name=rate]").val(score)
            rate = score
        }
    });
    raty.init()

    $('button').click(function(){
        var content = $("textarea[name='content']").val()
        $.post('/home/center/comment',{id,content,rate})
        .then((data)=>{
            if(data.code){
                location.reload();
            }else{
                mui.toast(data.msg,{duration:3000})
            }
        })
    })

    new WOW({
        boxClass: 'wow',      // 需要执行动画的元素的 class(默认是wow)
        animateClass: 'animated fadeInDown', // animation.css 动画的 class(默认是animated)
        offset: 0,          // 距离可视区域多少开始执行动画(默认为0)
        mobile: true,       // 是否在移动设备上执行动画(默认为true)
        live: true,       // 异步加载的内容是否有效(默认为true)
        scrollContainer: null // 可选滚动容器选择器，否则使用窗口
    }).init();
</script>